<template>
  <div style="height:100%;width:100%;position:relative;">
      <div class="pagetop" ref="buttondiv">
          <div style="width:100%;text-align:left">
              <table>
                  <tr>
                      <td width="320">
                          <el-radio-group v-model="itemtype" @change="typechange">
                              <el-radio label="reqgroup">分单类别</el-radio>
                              <el-radio label="reqitem">申请项目</el-radio>
                              <el-radio label="rptunit">报告单元</el-radio>
                              <el-radio label="rptitem">报告项目</el-radio>
                          </el-radio-group>
                      </td>
                      <td>分单类别</td>
                      <td>
                          <rm-ddl-common @change="reqgroupchange" datatype="reqgroup" defaultflag="1" dataname="分单类别" v-model="reqgroup" :disabled="disabledreq" width="120px"></rm-ddl-common>
                      </td>
                      <td>报告单元</td>
                      <td>
                          <rm-ddl-rptunit prgno="MNG248" :appendtobody="true" defaultflag="1" v-model="rptunitid" filterable clearable :disabled="disabledunit" @change="rptunitChange" width="160px"></rm-ddl-rptunit>
                      </td>
                      <td>查找</td>
                      <td>
                          <el-input v-model="qcode" style="width: 120px" @keyup.enter.native="SearchData()" placeholder="输入内容后回车查询"></el-input>
                      </td>
                  </tr>
              </table>
              <div style="text-align:right">
                  <div>
                      <!-- <el-button icon="el-icon-plus" @click="AddRow()">新增</el-button>
                      <el-button icon="el-icon-delete" @click="DeleteRow()">删除</el-button> -->
                      <el-button icon="el-icon-document" @click="SaveTat()" :disabled="changeflag">保存</el-button>
                      <el-button icon="el-icon-document" @click="CancelTat()" :disabled="changeflag">取消</el-button>
                      <el-button icon="el-icon-refresh" @click="QueryItems(itemtype);" :disabled="!changeflag">刷新</el-button>
                  </div>
              </div>
          </div>
      </div>
      <div class="pagecenter">
          <template>
              <rm-layout-right splitcolor="#F8F8FF" movingcolor="#00ff00" :splitwidth="3" :fixsize="700" :minfixsize="400">
                  <div style="height: 100%">
                      <vxe-table :data.sync="tableData" @current-change="DataSelect" :sort-config="{trigger: 'cell'}" height="100%" highlight-current-row ref="xtable1" resizable highlight-hover-column border show-header-overflow="tooltip" show-overflow="tooltip" header-align="center" :loading="loading" size="mini">
                          <!-- <vxe-table-column type="selection" width="60" align="center"></vxe-table-column> -->
                          <vxe-table-column :field="item.field" :title="item.title" :width="item.width" :align="item.align" :key="item.field" v-for="item in tableColumn" header-align="center">
                              <template v-slot="{ row }" v-if="item.field == 'tube_color'">
                                  <div :style="{ background: '#' + ColorChange(row.tube_color),height: '20px',width:'80px' }"></div>
                              </template>
                          </vxe-table-column>
                      </vxe-table>
                  </div>
                  <template v-slot:fix>
                      <div style="height:100%">
                          <vxe-table :data.sync="tableDataTat" :sort-config="{trigger: 'cell'}" height="100%" highlight-current-row ref="xtable2" resizable highlight-hover-column border show-overflow="tooltip" header-align="center" @edit-closed="TatClose" :loading="loadingtat" :edit-config="{trigger: 'click', mode: 'cell',showStatus: true,showIcon:false}" size="mini">
                              <!-- <vxe-table-column type="selection" width="60" align="center"></vxe-table-column> -->
                              <vxe-table-column field="emer_flag" title="急诊标志" width="160px" align="center" :formatter="['formatSelect', emeroptions]"></vxe-table-column>
                              <vxe-table-column field="pattypecode" title="病人类型" width="80px" align="center" :formatter="['formatSelect', pattypeoptions]"></vxe-table-column>
                              <!-- <vxe-table-column field="transport_req" title="转运标本" width="60px" align="center" :edit-render="{name: 'select', options: tranoptions,events: {change: HasChange}}"></vxe-table-column> -->
                              <vxe-table-column field="RP" title="接收-报告(分钟)" width="70px" align="center" :edit-render="{name: 'input',autoselect: true,events: {change: HasChange} }"></vxe-table-column>
                              <vxe-table-column field="QC" title="申请-采样(分钟)" width="70px" align="center" :edit-render="{name: 'input',autoselect: true,events: {change: HasChange} }"></vxe-table-column>
                              <vxe-table-column field="CR" title="采样-接受(分钟)" width="70px" align="center" :edit-render="{name: 'input',autoselect: true,events: {change: HasChange} }"></vxe-table-column>
                              <vxe-table-column field="QP" title="申请-报告(分钟)" width="70px" align="center" :edit-render="{name: 'input',autoselect: true,events: {change: HasChange} }"></vxe-table-column>
                              <vxe-table-column field="CP" title="采样-报告(分钟)" width="70px" align="center" :edit-render="{name: 'input',autoselect: true,events: {change: HasChange} }"></vxe-table-column>
                              <vxe-table-column field="QR" title="申请-接收(分钟)" width="70px" align="center" :edit-render="{name: 'input',autoselect: true,events: {change: HasChange} }"></vxe-table-column>
                              <vxe-table-column field="SP" title="送达-报告(分钟)" width="70px" align="center" :edit-render="{name: 'input',autoselect: true,events: {change: HasChange} }"></vxe-table-column>

                          </vxe-table>
                      </div>
                  </template>
              </rm-layout-right>
          </template>
      </div>
  </div>
</template>

<script>
// import { parse } from "path";
import XE from "xe-utils"; //引入工具类
XE.mixin({
  // 自定义全局的格式化处理函数
  formatSelect(cellValue, list) {
      let item = list.find((item) => item.value == cellValue);
      return item ? item.label : cellValue;
  },
});
export default {
  name: "MNG248",
  data() {
      return {
          itemtype: "reqgroup",
          qcode: "", //查找条件
          rptunitid: 0, //报告单元
          reqgroup: "", //分单类别
          disabledreq: true,
          disabledunit: true,

          loading: false,
          loadingtat: false,
          tableDataAll: [],
          tableData: [],
          tableDataTat: [],
          tableColumn: [],
          tableColumn1: [
              { field: "req_groupcode", title: "分单类别代码", width: "80px", align: "left" },
              { field: "req_groupname", title: "分单类别名称", width: "120px", align: "left" },
              { field: "tube_color", title: "试管颜色", width: "80px", align: "center" },
              { field: "req_groupna", title: "类别简称", width: "80px", align: "left" },
              { field: "barcode_head", title: "条码前缀", width: "60px", align: "left" },
              { field: "collect_tips", title: "采样提示", width: "60px", align: "left" },
              { field: "labgroupname", title: "所属组", width: "50px", align: "left" },
              { field: "specimen_name", title: "默认采集标本", width: "60px", align: "left" },
              { field: "description", title: "备注", width: "160px", align: "left" },
              { field: "req_groupid", title: "分单类别ID", width: "60px", align: "left" },
          ],
          tableColumn2: [
              { field: "req_groupna", title: "分单类别", width: "60px", align: "left" },
              { field: "req_itemname", title: "项目名称", width: "100px", align: "left" },
              { field: "item_price", title: "单价", width: "60px", align: "right" },
              { field: "req_itemcode", title: "项目代码", width: "60px", align: "left" },
              { field: "req_itemna", title: "项目简称", width: "60px", align: "left" },
              { field: "itemclassname", title: "项目归类", width: "60px", align: "left" },
              { field: "his_class", title: "外部类别", width: "60px", align: "left" },
              { field: "his_itemcode", title: "项目代码(HIS)", width: "80px", align: "left" },
              { field: "his_itemname", title: "项目名称(HIS)", width: "100px", align: "left" },
              { field: "perform_deptname", title: "执行科室", width: "80px", align: "left" },
              { field: "inputcode", title: "拼音码", width: "60px", align: "left" },
              { field: "sex_flag", title: "适合性别", width: "60px", align: "center" },
              { field: "emer_flag", title: "允许急诊", width: "60px", align: "center" },
              { field: "comb_flag", title: "组合项目", width: "60px", align: "center" },
              { field: "out_flag", title: "外送项目", width: "60px", align: "center" },
              { field: "specimen_name", title: "默认标本类型", width: "60px", align: "center" },
          ],
          tableColumn3: [
              { field: "rptunitname", title: "报告单元名称", width: "160px", align: "left" },
              { field: "labgroupname", title: "所属检验工作组", width: "80px", align: "center" },
              { field: "rptunitno", title: "单元代码", width: "60px", align: "left" },
              { field: "reporttype", title: "业务类型", width: "60px", align: "center" },
              { field: "inuse", title: "在用", width: "60px", align: "center" },
              { field: "rptunitid", title: "ID", width: "60px", align: "right" },
          ],
          tableColumn4: [
              { field: "itemclassname", title: "项目归类", width: "60px", align: "left" },
              { field: "instrclassname", title: "仪器类别", width: "80px", align: "left" },
              { field: "rpt_itemcode", title: "项目代码", width: "60px", align: "left" },
              { field: "itemcode_en", title: "英文缩写", width: "100px", align: "left" },
              { field: "rpt_itemname", title: "报告项目名称", width: "120px", align: "left" },
              { field: "itemtips", title: "项目备注", width: "160px", align: "left" },
              { field: "germflag", title: "细菌标识", width: "60px", align: "center" },
              { field: "inputcode", title: "助记符", width: "60px", align: "left" },
              { field: "rptunitid", title: "报告单元ID", width: "60px", align: "left" },
          ],

          keyConfig: {
              isDel: true,
              isTab: true,
              isEdit: true,
          },
          keyLocalConfig: {
              isArrow: true,
          },
          selectConfig: { tigger: "row" },
          tranoptions: [
              { label: "全部", value: "A" },
              { label: "未经过转运的标本", value: "0" },
              { label: "经过转运的标本", value: "1" },
          ],
          pattypeoptions: [
              { label: "门诊", value: "1" },
              { label: "住院", value: "3" },
              { label: "体检", value: "4" },
              { label: "其他", value: "Q" },
          ],
          emeroptions: [
              { label: "常规", value: "0" },
              { label: "急诊", value: "1" },
          ],
          changeflag: true,
          DelIndex: -1,
      };
  },
  created() {
      this.InitPageData();
  },
  mounted() {},
  updated() {},
  methods: {
      InitPageData() {
          this.tableColumn = this.tableColumn1;
          this.QueryItems("reqgroup");
      },
      DataSelect({ row }) {
          this.SelectItem(row);
      },
      SelectItem(row) {
          let keycode = "";
          switch (this.itemtype) {
              case "reqgroup":
                  keycode = row.req_groupid;
                  break;
              case "reqitem":
                  keycode = row.req_itemcode;
                  break;
              case "rptunit":
                  keycode = row.rptunitid;
                  break;
              case "rptitem":
                  keycode = row.rpt_itemcode;
                  break;
          }
          this.QueryTat(keycode);
      },
      QueryItems(type) {
          this.loading = true;
          this.$tool
              .request({
                  url: "MNG/MNG2/MNG248",
                  method: "post",
                  data: {
                      action: "queryitems",
                      type: type,
                      rptunitid: !this.disabledunit ? this.rptunitid : "0",
                  },
              })
              .then((res) => {
                  this.loading = false;
                  if (res && !res.hasOwnProperty("errcode")) {
                      this.tableDataAll = res;
                      this.tableData = res;
                      if (res.length > 0) {
                          this.SelectItem(res[0]);
                          this.$nextTick(() => {
                              this.$refs.xtable1.setCurrentRow(res[0]);
                          });
                      }
                  }
              })
              .catch((err) => {
                  this.loading = false;
              });
      },
      QueryTat(code) {
          this.loadingtat = true;
          this.$tool
              .request({
                  url: "MNG/MNG2/MNG248",
                  method: "post",
                  data: {
                      action: "querytat",
                      type: this.itemtype,
                      keycode: code,
                  },
              })
              .then((res) => {
                  this.loadingtat = false;
                  if (res && !res.hasOwnProperty("errcode")) {
                      this.tableDataTat = res;
                  }
              })
              .catch((err) => {
                  this.loadingtat = false;
              });
      },
      rptunitChange(val) {
          if (this.itemtype == "rptitem") {
              this.QueryItems("rptitem");
          }
      },
      reqgroupchange(val) {
          if (val) {
              this.tableData = this.tableDataAll.filter((item) => item.itemclasscode == val);
          } else {
              this.tableData = XE.clone(this.tableDataAll, true);
          }
      },
      typechange(val) {
          switch (val) {
              case "reqgroup":
                  this.tableColumn = this.tableColumn1;
                  this.disabledreq = true;
                  this.disabledunit = true;
                  break;
              case "reqitem":
                  this.tableColumn = this.tableColumn2;
                  this.disabledreq = false;
                  this.disabledunit = true;
                  break;
              case "rptunit":
                  this.tableColumn = this.tableColumn3;
                  this.disabledreq = true;
                  this.disabledunit = true;
                  break;
              case "rptitem":
                  this.tableColumn = this.tableColumn4;
                  this.disabledreq = true;
                  this.disabledunit = false;
                  break;
          }
          this.QueryItems(val);
      },
      ColorChange(color) {
          if (color != null) {
              var tempcolor = color.toString(16);
              var num = 6 - tempcolor.length;
              var result = tempcolor;
              if (num > 0) {
                  for (let i = 0; i < num; i++) {
                      result = "0" + result;
                  }
              }
              var resultarr = result.split("");
              var r1 = resultarr[0];
              var r2 = resultarr[1];
              resultarr[0] = resultarr[4];
              resultarr[1] = resultarr[5];
              resultarr[4] = r1;
              resultarr[5] = r2;
              result = resultarr.join("");
              return result;
          } else {
              return "";
          }
      },
      AddRow() {
          this.$refs.xtable2.insertAt({ emer_flag: "A", pattypecode: "A", transport_req: "A" }, -1).then((rows) => {
              this.$refs.xtable2.setCurrentRow(rows.row);
              this.changeflag = false;
          });
      },
      DeleteRow() {
          let row = this.$refs.xtable2.getCurrentRow();
          if (row) {
              this.$confirm("您确定要删除这条记录吗?", {
                  confirmButtonText: "确定",
                  cancelButtonText: "取消",
                  type: "warning",
              })
                  .then(() => {
                      this.$table.DelRecordSelect(this.$refs.xtable2, this.DelIndex, this);
                      this.changeflag = false;
                  })
                  .catch(() => {});
          }
      },
      HasChange() {
          this.changeflag = false;
      },
      SaveTat() {
          let row = this.$refs.xtable1.getCurrentRow();
          if (row) {
              let keycode = "";
              switch (this.itemtype) {
                  case "reqgroup":
                      keycode = row.req_groupid;
                      break;
                  case "reqitem":
                      keycode = row.req_itemcode;
                      break;
                  case "rptunit":
                      keycode = row.rptunitid;
                      break;
                  case "rptitem":
                      keycode = row.rpt_itemcode;
                      break;
              }
              this.$tool
                  .request({
                      url: "MNG/MNG2/MNG248",
                      method: "post",
                      data: {
                          action: "save",
                          hospcode: row.hospcode,
                          keycode: keycode,
                          type: this.itemtype,
                          urec: this.$refs.xtable2.getRecordset(),
                      },
                  })
                  .then((res) => {
                      if (res.errcode == "1") {
                          this.$message.success("保存成功");
                          this.SelectItem(row);
                          this.changeflag = true;
                      }
                  });
          }
      },
      CancelTat() {
          let row = this.$refs.xtable1.getCurrentRow();
          if (row) {
              this.SelectItem(row);
              this.changeflag = true;
          }
      },
      //查找数据
      SearchData() {
          let val = this.qcode;
          switch (this.itemtype) {
              case "reqgroup":
                  this.tableData = this.tableDataAll.filter((item) => (item.req_groupcode && item.req_groupcode.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.req_groupname && item.req_groupname.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.req_itemcode && item.req_itemcode.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.req_itemna && item.req_itemna.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.collect_tips && item.collect_tips.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.req_groupid && item.req_groupid == val));
                  break;
              case "reqitem":
                  this.tableData = this.tableDataAll.filter((item) => (item.itemclassname && item.itemclassname.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.req_itemname && item.req_itemname.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.req_groupna && item.req_groupna.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.his_itemcode && item.his_itemcode.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.his_itemname && item.his_itemname.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.inputcode && item.inputcode.toUpperCase().indexOf(val.toUpperCase()) > -1));
                  break;
              case "rptunit":
                  this.tableData = this.tableDataAll.filter((item) => (item.rptunitname && item.rptunitname.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.rptunitid && item.rptunitid == val) || (item.rptunitno && item.rptunitno.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.reporttype && item.reporttype.toUpperCase().indexOf(val.toUpperCase()) > -1));
                  break;
              case "rptitem":
                  this.tableData = this.tableDataAll.filter((item) => (item.itemclassname && item.itemclassname.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.instrclassname && item.instrclassname.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.rpt_itemcode && item.rpt_itemcode.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.itemcode_en && item.itemcode_en.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.rpt_itemname && item.rpt_itemname.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.itemtips && item.itemtips.toUpperCase().indexOf(val.toUpperCase()) > -1) || (item.inputcode && item.inputcode.toUpperCase().indexOf(val.toUpperCase()) > -1));
                  break;
          }
          this.$nextTick(() => {
              if (this.tableData.length > 0) {
                  this.SelectItem(this.tableData[0]);
                  this.$nextTick(() => {
                      this.$refs.xtable1.setCurrentRow(this.tableData[0]);
                  });
              } else {
                  this.tableDataTat = [];
              }
          });
      },
      TatClose({ row, column }) {
          let val = row[column.property];
          let samedata = this.$refs.xtable2.tableData.filter((item) => item.emer_flag == row.emer_flag);
          for (let i = 0; i < samedata.length; i++) {
              if (samedata[i][column.property] == "") {
                  samedata[i][column.property] = val;
              }
          }
      },
  },
};
</script>
<style scoped>
.pagetop {
  left: 0;
  right: 0;
  height: 72px;
  display: -webkit-box;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  border: solid 1px #ccc;
  position: absolute;
  z-index: 99;
}

.pagecenter {
  position: absolute;
  top: 76px;
  width: 100%;
  left: 0;
  bottom: 5px;
}
/deep/ .el-radio {
  margin-right: 10px;
}
table tr td:nth-child(even) {
  text-align: right;
  white-space: nowrap;
  font-size: 12px;
}
table tr td:nth-child(odd) {
  text-align: left;
}
/deep/.el-button.is-disabled {
  border: 0px;
  color: grey;
  background-color: #e6e6e6;
  font-weight: normal;
}
</style>
